<!--
 * @Description:
 * @Author: HYH
 * @LastEditors: HYH
 * @LastEditTime: 2023-06-05 10:28:18
-->
<template>
  <el-dropdown
    @command="handleClick"
    style="cursor: pointer; height: 100%; padding: 0 5px; margin: 0 20px; color: #409EFF">
    <span class="el-dropdown-link"> {{ $t('language') }}<i class="el-icon-sort"></i> </span>
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item command="zh_CN">Zh</el-dropdown-item>
      <el-dropdown-item command="en_US">En</el-dropdown-item>
      <el-dropdown-item command="ja_JP">JP</el-dropdown-item>
    </el-dropdown-menu>
  </el-dropdown>
</template>

<script>
/**多语言 */
import locale from 'element-ui/lib/locale'
import langJP from 'element-ui/lib/locale/lang/ja'
import langEn from 'element-ui/lib/locale/lang/en'
import langCn from 'element-ui/lib/locale/lang/zh-CN'
const language = localStorage.getItem('language') || 'zh_CN'
locale.use(language == 'zh_CN' ? langCn : language == 'ja_JP' ? langJP : langEn) //设置element组件语言  国际化

export default {
  name: 'Screenfull',
  data() {
    return {}
  },
  created() {
    let lang = navigator.language || navigator.userLanguage //常规浏览器语言和IE浏览器
    let language = localStorage.getItem('language')
    if (language != undefined && language != null && language != '') {
      this.$store.dispatch('settings/changeLanguage', language)
    } else {
      this.$store.dispatch('settings/changeLanguage', lang.replace('-', '_'))
    }
    this.handleClick(this.$store.state.settings.language)
  },
  methods: {
    handleClick(type, reload = false) {
      this.$store.dispatch('settings/changeLanguage', type)
      this.$i18n.locale = type
      localStorage.setItem('language', type)
      if (reload) this.$nextTick(() => window.location.reload())
    },
  },
}
</script>

<style scoped></style>
